<template>
  <el-col :span="8">
    <!-- 搜索框-->
    <el-input placeholder="请输入关键字" v-model="query" clearable @clear="restoreDataList">
      <el-button slot="append" icon="el-icon-search" @click="search(query)"></el-button>
    </el-input>
  </el-col>
</template>
<script>
export default {
  props: ['list', 'type'],
  data() {
    return {
      query: ''
    }
  },
  methods: {
    // 搜索框
    search(keywords) {
      this.dataList = this.list.filter(item => {
        var prop = 'userName'
        switch (this.type) {
          case 'post':
            prop = 'publisher'
            break
          case 'msg':
            prop = 'name'
            break
          case 'college':
            prop = 'collegeName'
            break
          default:
            prop = 'userName'
            break
        }
        if (item[prop].includes(keywords)) {
          return item
        }
      })
      this.$emit('searchData', this.dataList)
    },
    restoreDataList() {
      this.$emit('clearSearch', 'ok')
    }
  },
  mounted() {}
}
</script>
<style lang="less" scoped>
</style>
